import React from 'react';
import { hashHistory } from 'react-router'
import './index.less';
import PropTypes from 'prop-types';
import {Toast,Modal,Badge,Icon, List} from 'antd-mobile';
import FootTabBar from 'COMPONENT/FootTabBar';
import CommonHeader from 'COMPONENT/CommonHeader';

const alert = Modal.alert;

export default class My extends React.Component {
    static contextTypes = {
        router: PropTypes.object.isRequired
    }
    constructor(props) {
        super(props);
        
        this.state = {
          infomation: {},
          template:'defaultTemplate',
          version:'false',
          src:"",
          versionNum:''
        }
    }

    componentWillMount() {
       

    }

    
    
    outLogin = () => {

    	localStorage.setItem('isLogIn','false');
        this.context.router.push({
          pathname: '/Home'
        })
    }
    
    //退出登录
    loginOut=()=>{
    	let _this = this;
        alert('', '是否确定退出登录?', [
            { text: '取消', onPress: () =>  console.log('cancel') },
            { text: '确定', onPress: this.outLogin.bind(this)}
        ])
    }
 

    //修改头像跳转原生方法
    modifyHead=()=>{
        let _this = this;
        let {src} =_this.state;
        native.call({
           'fun':'modifyHead'
        })
    }
	
	jumpToAccountSecret = () => {
		native.call({
        	'fun':'openAccountList'
    	})
	}
	
    render() {
      

        let defaultTemplate = ()=>{
            return(
                <div className='personalInfo'>
	                
                    <div className= 'personalInfo-list' >
                        
                        <div onClick={() => { hashHistory.push('/UserInfo') }}>
                            用户信息
                            <Icon type="right" className="personal-icon" />
                        </div>
                        <div>我的资产  </div>
                        <div >
                            账单查询 
                        </div>
                       

                        <div id="accountSecret" onClick={this.jumpToAccountSecret.bind(this)}>
                        	账户安全
                            <Icon type="right" className="personal-icon" />
                        
                        </div>
                        <div onClick={() => { hashHistory.push('/Help') }}>
                            帮助中心
                            <Icon type="right" className="personal-icon" />
                        </div>
                       
                        
                    </div>
                    <div className='info-btn'>
                        <button  onClick={this.loginOut}>注销</button>
                    </div>
                    <div style={{height:'2rem'}}></div>
                </div>
            )
        }
        let tpl= this.state.template+ '()';
        return(
            <div>

				<CommonHeader 
						name= "我的"					
						leftContentTitle="@back"
						leftContent="返回"
					/>
	    		<div style={{height:'.9rem'}}></div>
                <div className= 'infomation' style={{padding:'0'}}>
                    <div className= 'headInfo'>
                        <img src="./imgs/avatar_men.png" className='modifyHead' onClick={this.modifyHead.bind(this)}/>
                       <span>姓名: 李某</span>
                    </div>
                    {eval(tpl)}
                </div>
                <FootTabBar selectedTab='yellowTab'/>
            </div>
        );
    }
}